<!DOCTYPE html>
<title>media controls cast button</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../media-controls.js"></script>
<video></video>
<script>
async_test(function(t) {
    var video = document.querySelector("video");
    video.src = "../content/test.ogv";

    video.onloadedmetadata = t.step_func_done(function() {
        // Should not have a cast button by default
        var button = overlayCastButton(video);
        assert_false(isControlVisible(button), "button should not be visible with no cast devices");

        // Pretend we have a cast device
        internals.mediaPlayerRemoteRouteAvailabilityChanged(video, true);

        // Now should have cast button
        assert_true(isControlVisible(button), "button should exist");
        var rect = button.getBoundingClientRect();
        assert_not_equals(rect.width, 0, "button should exist");
        assert_not_equals(rect.height, 0, "button should exist");

        // Check position, should be in the top left corner of the video
        var videoRect = video.getBoundingClientRect();
        assert_greater_than_equal(rect.top, videoRect.top, "button should be at top left of video");
        assert_greater_than_equal(rect.left, videoRect.left, "button should be at top left of video");
        assert_less_than_equal(rect.bottom, videoRect.top + videoRect.height / 2, "button should be at top left of video");
        assert_less_than_equal(rect.right, videoRect.left + videoRect.width / 2, "button should be at top left of video");

        // Remove cast device - cast button should go away
        internals.mediaPlayerRemoteRouteAvailabilityChanged(video, false);
        assert_false(isControlVisible(button), "button should not be visible after cast device goes away");
    });
});
</script>
